<table class="table table-striped">
		<thead>
			<tr>
				<th><?php echo lang('bf_id'); ?></th>
				<th><?php echo lang('bf_display_name'); ?></th>
				<th>Total amount</th>
				<th>Amount paid</th>
				<th>Amount left</th>
				<th>Amount to pay</th>
				<th></th>
			</tr>
		</thead>
		<tbody>
		<?php if (!empty($pay_detail)): ?>
			<tr>
				<td><?php echo $pay_detail['user']->id ?></td>
				<td><?php echo $pay_detail['user']->display_name ?></td>
				<td><?php echo $pay_detail['total_amount'] ?></td>
				<?php $total_paid = $pay_detail['pay_detail']? $pay_detail['pay_detail']->total_paid : 0 ?>
				<td><?php echo $total_paid?></td>
				<td><?php echo $pay_detail['total_amount'] - $total_paid?></td>
				<td><input type="text" name="paid" value="<?php echo $pay_detail['total_amount'] - $total_paid?>"></td>
				<td><a class="btn btn-primary" href="#" onclick="pay();">Pay</a></td>
			</tr>
		<?php else: ?>
			<tr>
				<td colspan="8">No users found that match your selection.</td>
			</tr>
		<?php endif; ?>
		</tbody>
</table>

<script type="text/javascript">
	function pay()
	{
		paid_amount = document.getElementsByName('paid')[0].value;
		if(paid_amount > <?php echo $pay_detail['total_amount'] - $total_paid?>)
		{
			alert('Amount to pay must not be greater than amount left');
		}
		else
		{
			$.post("<?php echo site_url(SITE_AREA .'/content/blog/pay_amount/'.$pay_detail['user']->id) ?>/"+paid_amount,function(data){
						if(data)
						{
							alert('Amount is paid');
							location.reload();
						}
						else
						{
							alert('Error while payment');
							location.reload();
						}
			
				});
		}	
	}
</script>